<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"/>
	<meta content="telephone=no" name="format-detection"/>
	<meta name="description" content=""/>
	<meta name="keywords" content=""/>

	<title>服务预约</title>

	<style>
		* {
			margin: 0;
			padding: 0;
		}
		img {
			position: absolute;
			/* top: 0; */
			bottom: 0;
			width: 100%;
			/* height: 100%; */
		}
		div {
			position: relative;
			/* height: 100%; */
			overflow-y: scroll;
			-webkit-overflow-scrolling: touch;
		}
		body {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
		}
	</style>
<body id="box">
	<div id="div">
		<img src="img/service.png" alt="" id="img1">
	</div>
	
</body>
</html>

<script src="../comment_js/jquery-1.11.1.js"></script>
<script>
	(function(){
		var box = document.querySelector('#box')
		var div = document.querySelector('#div')
		// setTimeout(function(){
		// 	div.style.height = $('img').height()+'px'
		// 	console.log($('img').height().toFixed())
		// },200)
		var img1 = document.querySelector('#img1')
		function imgLoad(img, callback) {
            var timer = setInterval(function() {
                if (img.complete) {
                    callback(img)
                    clearInterval(timer)
                }
            }, 50)
        }
        imgLoad(img1, function() {
			div.style.height = $('img').height()+'px'
			console.log($('img').height().toFixed())
        })
	})()
	
</script>
